<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8" />
    <style>
        header nav ul {
            display: flex;
        }

        header nav ul li {
            width: 100px;
            height: 40px;
        }

        main {
            display: flex;
        }

        .categories {
            width: 500px;
            height: 300px;
        }

        .post-list {
            width: 1000px;
        }

        .sidebar {
            width: 500px;
        }

    </style>
</head>

<body>
    <header>
        <nav>
            <ul>
                <li><a href="/index">首页</a></li>
                <li><a href="/about">关于</a></li>
            </ul>
        </nav>
    </header>
    <main>
        <div class="categories">博文分类</div>
        <div class="post-list">博文列表</div>
        <div class="sidebar">侧边栏</div>
    </main>
    <footer>
        <h1>是的发生的发生的</h1>
    </footer>
</body>

</html>